<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"          
          xmlns:c="http://java.sun.com/jsp/jstl/core"
          xmlns:display="urn:jsptld:http://displaytag.sf.net"
          version="2.0">

    <jsp:directive.page import="java.util.ArrayList"/>
    <jsp:directive.page import="java.util.Iterator"/>
    <jsp:directive.page import="entity.Users"/>
    <jsp:directive.page import="java.util.List"/>

    <jsp:directive.page contentType="text/html" pageEncoding="UTF-8"/>

    <html>
        <head>
            <meta charset="utf-8"/>
            <link rel="stylesheet"  href="admin_style.css"  type="text/css" />
            <title>Admin</title>
        </head>
       <header>
            <div id ="top_name"> <h1> Admin </h1> </div>
            <div id="user-panel">
                <p> <a href="#">User name</a>
                    <a href="#">LogOut</a> </p>
            </div>
            <div id="menu">
               <!-- <div id="role"> <select size = '1'> 
                        <option value='1'> Customer </option>
                            <option value='2'> Warehouse Employee </option> 
                            <option value='3'> Courier </option> 
                            <option value='4'> Admin </option> 
                    </select> </div>-->
            </div>
        </header>
        <div id="main">
            <div id="find">  
                  <c:if test="${not empty groups}"> <a href="/first/index"> AAAAAAAAA </a></c:if>

                    <form method="POST" action="find"> 
                        <p>Find: <br/>
                            <input type="text" size="30" value="keyword" id="label"/>
                            <!--<button type="submit" style="width:60px;"> Go </button> --></p>
                    </form>
            </div>
                  <div id="sorted"> <p> Sort by:</p> 
                   <select width="500" size = '1' name='SortBy'> 
                    <option value='LastName' > Last name </option>
                    <option value='Login' > Login </option>
                    <option value='Email' > E-mail </option>
                
                </select> 
            </div>
            <div id="export"> 
                <button type="submit" style="width:100px; background: #32CD32;" >Export data</button>
            </div>
            <div id="tabl">
            <c:if test="${not empty users}"></c:if>
                <table border="2">
                                  <TR>
                        <td width="100" height="20" bgcolor="99CCFF" align="middle"><strong>Name</strong></td>
                        <td width="150" height="20" bgcolor="99CCFF" align="middle"><strong>Last Name</strong></td>
                        <td width="250" height="20" bgcolor="99CCFF" align="middle"><strong>Address</strong></td>
                        <td width="125" height="20" bgcolor="99CCFF" align="middle"><strong>E-mail</strong></td>
                        <td width="100" height="20" bgcolor="99CCFF" align="middle"><strong>Group</strong></td>
                        <td width="100" height="20" bgcolor="99CCFF" align="middle"><strong>Roles</strong></td>
                    </TR>
                    <c:forEach var="user" items="${users}">

                                <tr>
                                    <td width="100" height="20" bgcolor="99CCFF" align="middle"><c:out value="${user.getFirstName()}"/></td>
                                    <td width="150" height="20" bgcolor="99CCFF" align="middle"><c:out value="${user.getLastName()}"/></td>
                                    <td width="100" height="20" bgcolor="99CCFF" align="middle"><c:out value="${user.getAddress()}"/></td>
                                    <td width="100" height="20" bgcolor="99CCFF" align="middle"><c:out value="${user.getEMail()}"/></td>
                                    <td width="100" height="20" bgcolor="99CCFF" align="middle">
                                        <select>
                                            <c:forEach var="aff" items="${groups}">
                                                <option><c:out value="${aff.getGroupName()}"/></option>
                                            </c:forEach>
                                        </select>
                                    </td>
                                    <td width="100" height="20" bgcolor="99CCFF" align="middle">
                                        <select>
                                            <c:forEach var="role" items="${roles}">
                                                <option ><c:out value="${role.getRoleName()}"/></option>
                                            </c:forEach>
                                        </select>
                                    </td>

                                </tr>
                                <!-- display:column title="Edit"> <c:set var="id" value="${user.getIdUser()}" />    
                                           <a href="index_1.jsp?${id}" onclick="selectobjID(${id})">Edit </a></display:column> -->
                            </c:forEach>
                </table>
            </div>
            <div id="button1"> <button type="submit" style="width:120px; background: #6699FF;" > <a href="/first/add_user">Add </a> </button> </div>
            <div id="button1"> <button type="submit" style="width:120px; background: #6699FF;" > Delete </button> </div>
            <div id="button1"> <button type="submit" style="width:120px; background: #6699FF;" > <a href="/first/add_user"> Edit </a> </button> </div>
            <div id="button2"> <button type="submit" style="width:120px; background: #6699FF;" > <a href="/first/index"> Refresh </a> </button> </div>
            <div id="button1"> <button type="submit" style="width:120px; background: #6699FF;" > Confirm changes </button> </div>
            <div>
                <div id="groups">  
                    <p> <span style="cursor:pointer;color:blue" onclick="document.getElementById('group_menu').style.height = '400px'"> Groups </span>
                    </p>
                </div>
                <div id="group_menu" style="height:20px;overflow:hidden">
                    <br/>
                    <br/>
                    <br/>
                    <div id="group_tabl">
                        <table border="2">
                            <TR>
                                <td width="100" height="20" bgcolor="99CCFF" align="middle"><strong> Name </strong></td>
                                <td width="150" height="20" bgcolor="99CCFF" align="middle"><strong> Roles </strong></td>
                            </TR>
                            <TR>
                                <td width="100" height="15"> </td>
                                <td width="150"  height="15"> </td>
                            </TR>
                            <TR>
                                <td width="100" height="15"> </td>
                                <td width="150"  height="15"> </td>
                            </TR>
                            <TR>
                                <td width="100" height="15"> </td>
                                <td width="150"  height="15"> </td>
                            </TR>
                        </table>
                    </div>
                    <div id="group_button1"> <input type="submit" value="Edit" name="export" style="width:120px; background: #6699FF;"/></div>
                    <div id="group_button1"> <input type="submit" value="Delete" name="export" style="width:120px; background: #6699FF;"/></div>
                    <p> <br/> Name </p>
                        <input type="text" size="30" value="name" id="label"/>
                    <p> Roles <input type="text" size="30" value="roles" id="label"/></p>
                     <!--    Add roles   <select name="role" size = "1"> 
                            <option value='1'> Customer </option>
                            <option value='2'> Warehouse Employee </option> 
                            <option value='3'> Courier </option> 
                        </select> -->
                        <button type="submit"  style="width:120px; background: #6699FF;" > Add </button> 
                    <div> <button type="submit" style="width:120px; background: #6699FF;" > Create </button> </div>
                    <br/>
                </div>
            </div>
        </div>
</html>
</jsp:root>